<template>
    <div class="dingjin">
        <div class="yingfu">
            <span>应付金额：</span><span>￥{{ z_money }}元</span>
        </div>
        <van-radio-group v-model="radio">
            <ul class="fuzhang">
                <li>
                    <img src="../../../assets/dingdanxinxi/kehuyue.jpg" alt=""/>
                    <span>{{ fukuan[0].text }}</span>
                    <van-radio
                            class="radio_checke_fukuan_style"
                            value="账户余额"
                            name="账户余额"
                    ></van-radio>
                </li>
                <li>
                    <img src="../../../assets/dingdanxinxi/zhifubao.jpg" alt=""/>
                    <span>{{ fukuan[1].text }}</span>
                    <van-radio
                            class="radio_checke_fukuan_style"
                            value="支付宝"
                            name="支付宝"
                    ></van-radio>
                </li>
                <li>
                    <img src="../../../assets/dingdanxinxi/weixin.jpg" alt=""/>
                    <span>{{ fukuan[2].text }}</span>
                    <van-radio
                            class="radio_checke_fukuan_style"
                            value="微信"
                            name="微信"
                    ></van-radio>
                </li>
            </ul>
        </van-radio-group>
        <div class="tongyi_yuedu">
            <van-checkbox class="ckecked_tongyi_ground_btn" v-model="checked" shape="square"></van-checkbox>
            <span>同意</span>
            <span>《平价分时租车租赁协议》</span>
        </div>
        <van-button
                :disabled="!checked"
                class="buton_botom"
                type="info"
                @click="fukuantotongzhi">
            {{ radio }}
        </van-button>
    </div>
</template>

<script>
    import {pay} from "../../../request/userinfo/userinfo";
    import {Notify} from "vant";

    export default {
        props: {},
        data() {
            return {
                radio: "账户余额支付",
                checked: false,
                fukuan: [{text: "账户余额支付"}, {text: "支付宝"}, {text: "微信"}],
                z_money: 0,
            };
        },
        methods: {
            fukuantotongzhi() {
                // "2020-11-26 08:18:55 "
                let stime = new Date(this.$store.state.startime);
                let etime = new Date(this.$store.state.endtime);
                let new_stime =
                    stime.getFullYear() +
                    "-" +
                    (stime.getMonth() + 1) +
                    "-" +
                    stime.getDate() +
                    " " +
                    new Date().getHours() +
                    ":" +
                    new Date().getMinutes() +
                    ":" +
                    new Date().getSeconds();
                let new_etime =
                    etime.getFullYear() +
                    "-" +
                    (etime.getMonth() + 1) +
                    "-" +
                    etime.getDate() +
                    " " +
                    new Date().getHours() +
                    ":" +
                    new Date().getMinutes() +
                    ":" +
                    new Date().getSeconds();
                /* console.log(new_stime);
                 console.log(this.z_money, this.$store.state.user.accountBalance);*/
                if (this.z_money > this.$store.state.user.accountBalance) {
                    console.log(this.z_money),
                        console.log(this.$store.state.user.accountBalance),
                        Notify({type: "danger", message: "余额不足请充值"});
                    this.$router.push("/wallet");
                } else {
                    console.log(this.$store.state.brrowShop);
                    console.log(this.$store.state.carinfo.id);
                    console.log(this.$store.state.user.id);
                    pay({
                        brrowShop: this.$store.state.brrowShop, //门店id
                        carId: this.$store.state.carinfo.id, //车id
                        carName: this.$store.state.carinfo.carName, //车名
                        vin: this.$store.state.carinfo.vin, //车牌
                        memberId: this.$store.state.user.id, //用户id
                        memberName: this.$store.state.user.name, //用户id
                        // clientId: 1, //用户id
                        endTime: new_etime,
                        isgetcarathome: "string",
                        isreturncarathome: "string",
                        payType: 2,
                        preparidAmount: this.z_money,
                        returnShop: 1,
                        startTime: new_stime,
                        state: 3,
                        totalPrice: this.z_money, //支付金额
                    }).then((res) => {
                        this.$store.state.order = res;
                        this.$router.push("/dingdantongzhi");
                    });
                }
            },
        },
        created() {

        },
        mounted() {
            console.log(this.$store.state.carinfo);
            let money = this.$store.state.carinfo.price;
            let stime = this.$store.state.startime;
            let etime = this.$store.state.endtime;
            let date1 = new Date(stime);
            let date2 = new Date(etime);
            let time = Math.ceil(Math.abs(date2 - date1) / 24 / 60 / 60 / 1000);
            this.z_money = (money - 0) * time;
            console.log(this.z_money);
        },
        components: {},
    };
</script>

<style scoped lang="less">
    .dingjin {
        width: 100%;
        margin-top: 0.05rem;
        font-size: 0;
        .yingfu {
            width: 95%;
            height: 0.73rem;
            margin: 0 auto;
            border-radius: 0.08rem;
            background: white;
            line-height: 0.73rem;
            padding-left: 0.15rem;
            span {
                font-size: 0.25rem;
                font-weight: 600;
            }
            span:last-child {
                color: #f0230e;
            }
        }
        .fuzhang {
            width: 95%;
            height: 3.2rem;
            display: flex;
            flex-direction: column;
            justify-content: space-evenly;
            margin: 0 auto;
            margin-top: 0.25rem;
            position: relative;
            li {
                flex: 1;
                display: flex;
                align-items: center;
                img {
                    width: 0.6rem;
                    height: 0.6rem;
                    border-radius: 0.08rem;
                }
                span {
                    font-size: 0.26rem;
                    margin-left: 0.26rem;
                    font-weight: 600;
                }
            }
        }
        .tongyi_yuedu {
            width: 95%;
            margin: 0.27rem auto 0.6rem auto;
            display: flex;
            align-items: center;
            span:nth-child(2) {
                font-size: 0.22rem;
                color: #666;
                margin-left: 0.2rem;
            }
            span:last-child {
                font-size: 0.23rem;
                color: #4395ff;
                margin-left: 0.29rem;
            }
        }
        .buton_botom {
            width: 100%;
            height: 0.81rem;
            background: #4395ff;
            color: white;
            font-size: 0.29rem;
        }
    }
</style>
